<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>骨质疏松风险评估结果</title>
    <style>
        body {
            font-family: 'Microsoft YaHei', Arial, sans-serif;
            line-height: 1.6;
            color: #333;
            background-color: #f5f5f5;
            margin: 0;
            padding: 0;
        }
        
        .container {
            max-width: 800px;
            margin: 0 auto;
            padding: 20px;
            background-color: #fff;
            box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
            border-radius: 10px;
            margin-top: 40px;
            margin-bottom: 40px;
        }
        
        h1 {
            color: #2c3e50;
            text-align: center;
            margin-bottom: 30px;
            font-size: 2rem;
            border-bottom: 2px solid #3498db;
            padding-bottom: 10px;
        }
        
        .score-card {
            background-color: #f8f9fa;
            border-radius: 10px;
            padding: 20px;
            margin-bottom: 30px;
            text-align: center;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
        }
        
        .score-value {
            font-size: 3.5rem;
            font-weight: bold;
            color: #3498db;
            margin: 10px 0;
        }
        
        .health-level {
            display: inline-block;
            padding: 5px 20px;
            border-radius: 50px;
            font-weight: bold;
            margin: 10px 0;
        }
        
        .level-优 {
            background-color: #2ecc71;
            color: white;
        }
        
        .level-良 {
            background-color: #3498db;
            color: white;
        }
        
        .level-中 {
            background-color: #f39c12;
            color: white;
        }
        
        .level-差 {
            background-color: #e74c3c;
            color: white;
        }
        
        .level-极差 {
            background-color: #c0392b;
            color: white;
        }
        
        .section {
            margin-bottom: 30px;
            padding: 20px;
            background-color: #f8f9fa;
            border-radius: 10px;
            border-left: 4px solid #3498db;
        }
        
        .section h2 {
            color: #2c3e50;
            margin-top: 0;
            font-size: 1.5rem;
        }
        
        .risk-factors {
            margin-top: 15px;
        }
        
        .risk-factor {
            background-color: #fdedec;
            border-left: 3px solid #e74c3c;
            padding: 10px 15px;
            margin-bottom: 10px;
            border-radius: 5px;
        }
        
        .bmi-info {
            margin-top: 15px;
            text-align: center;
        }
        
        .bmi-value {
            font-size: 1.8rem;
            font-weight: bold;
            color: #3498db;
        }
        
        .bmi-status {
            display: inline-block;
            padding: 3px 15px;
            border-radius: 50px;
            font-size: 0.9rem;
            margin: 5px 0;
        }
        
        .status-正常 {
            background-color: #2ecc71;
            color: white;
        }
        
        .status-偏瘦 {
            background-color: #f39c12;
            color: white;
        }
        
        .status-偏胖 {
            background-color: #e74c3c;
            color: white;
        }
        
        /* 骨密度风险徽章样式 */
        .risk-badge {
            display: inline-block;
            padding: 5px 20px;
            border-radius: 50px;
            font-weight: bold;
            color: white;
        }
        
        .risk-高风险 {
            background-color: #e74c3c;
        }
        
        .risk-中风险 {
            background-color: #f39c12;
        }
        
        .risk-低风险 {
            background-color: #2ecc71;
        }
        
        .advice-container {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-top: 20px;
        }
        
        .advice-card {
            flex: 1 1 200px;
            background-color: #ebf5fb;
            border-radius: 10px;
            padding: 15px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
        }
        
        .advice-card h3 {
            color: #3498db;
            margin-top: 0;
            font-size: 1.2rem;
            border-bottom: 1px solid #ccc;
            padding-bottom: 8px;
        }
        
        .advice-card ul {
            padding-left: 20px;
            margin-bottom: 0;
        }
        
        .advice-card li {
            margin-bottom: 8px;
        }
        
        .navigation {
            display: flex;
            justify-content: center;
            gap: 20px;
            margin-top: 30px;
        }
        
        .btn {
            display: inline-block;
            padding: 10px 25px;
            background-color: #3498db;
            color: white;
            text-decoration: none;
            border-radius: 50px;
            font-weight: bold;
            transition: all 0.3s ease;
            border: none;
            cursor: pointer;
            font-size: 16px;
        }
        
        .btn:hover {
            background-color: #2980b9;
            transform: translateY(-2px);
            box-shadow: 0 4px 8px rgba(52, 152, 219, 0.3);
        }
        
        .btn-secondary {
            background-color: #95a5a6;
        }
        
        .btn-secondary:hover {
            background-color: #7f8c8d;
            box-shadow: 0 4px 8px rgba(149, 165, 166, 0.3);
        }
        
        @media (max-width: 768px) {
            .container {
                margin-top: 20px;
                margin-bottom: 20px;
                padding: 15px;
            }
            
            h1 {
                font-size: 1.6rem;
            }
            
            .score-value {
                font-size: 2.5rem;
            }
            
            .navigation {
                flex-direction: column;
                gap: 10px;
            }
            
            .btn {
                width: 100%;
                text-align: center;
            }
            
            .advice-container {
                flex-direction: column;
            }
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>骨质疏松风险评估结果</h1>
        
        <div class="score-card">
            <h2>您的骨骼健康评分</h2>
            <div class="score-value">{{ result.score }}</div>
            <div class="health-level level-{{ result.health_level }}">健康等级：{{ result.health_level }}</div>
            <p>{{ result.level_description }}</p>
        </div>
        
        {% if result.risk_factors %}
        <div class="section">
            <h2>风险因素分析</h2>
            <p>我们发现以下可能影响您骨骼健康的风险因素：</p>
            <div class="risk-factors">
                {% for factor in result.risk_factors %}
                <div class="risk-factor">{{ factor }}</div>
                {% endfor %}
            </div>
        </div>
        {% endif %}
        
        <div class="section">
            <h2>骨密度评估</h2>
            
            <div style="background-color: #e7f4ff; padding: 25px; border-radius: 10px; text-align: center;">
                <h3 style="color: #3498db; margin-top: 0; font-size: 1.6rem;">骨密度风险指数</h3>
                
                <div style="display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 20px; margin: 25px 0;">
                    <div style="min-width: 140px;">
                        <div style="font-size: 3rem; font-weight: bold; color: #3498db; line-height: 1.1;">
                            {{ result.bone_density.index }}
                        </div>
                        <div style="color: #666; margin-top: 5px;">风险指数</div>
                    </div>
                    
                    <div style="min-width: 140px;">
                        <div class="risk-badge risk-{{ result.bone_density.risk }}" style="font-size: 1.3rem; padding: 8px 25px;">
                            {{ result.bone_density.risk }}
                        </div>
                        <div style="color: #666; margin-top: 5px;">风险等级</div>
                    </div>
                </div>
                
                <p>{{ result.bone_density.comment }}</p>
            </div>
        </div>
        
        <div class="section">
            <h2>BMI 指数</h2>
            <div class="bmi-info">
                <div class="bmi-value">{{ result.bmi }}</div>
                <div class="bmi-status status-{{ result.bmi_status }}">{{ result.bmi_status }}</div>
                <p>{{ result.bmi_comment }}</p>
            </div>
        </div>
        
        <div class="section">
            <h2>健康建议</h2>
            <div style="margin-bottom: 20px;">
                <p style="font-size: 1.1rem; font-weight: bold; margin-bottom: 5px;">
                    根据您的骨密度风险等级 - 
                    {% if result.bone_density.risk == '高风险' %}
                    <span style="color: #e74c3c;">{{ result.bone_density.risk }}</span>
                    {% elif result.bone_density.risk == '中风险' %}
                    <span style="color: #f39c12;">{{ result.bone_density.risk }}</span>
                    {% else %}
                    <span style="color: #2ecc71;">{{ result.bone_density.risk }}</span>
                    {% endif %}，我们为您提供以下个性化建议：
                </p>
                <p>
                    {% if result.bone_density.risk == '低风险' %}
                    维持强健骨骼，预防骨质流失。
                    {% elif result.bone_density.risk == '中风险' %}
                    减缓骨质流失，维持现有骨密度，预防骨折。
                    {% else %}
                    最大限度减缓骨质流失，降低骨折风险，管理已有骨质疏松（如适用）。
                    {% endif %}
                </p>
            </div>
            
            <div class="advice-container">
                <div class="advice-card">
                    <h3>饮食建议</h3>
                    {% if result.bone_density.risk == '低风险' %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 均衡营养，确保骨骼构建营养素充足。</p>
                    <ul>
                        <li><strong>钙：</strong> 每日摄入推荐量（通常成人1000mg，50岁以上女性及70岁以上男性1200mg）。优先选择富含钙的食物：奶制品（牛奶、酸奶、奶酪）、强化豆奶/杏仁奶、深绿色叶菜（羽衣甘蓝、西兰花、芥菜）、豆腐（含钙凝固剂）、带骨小鱼（沙丁鱼、三文鱼罐头）、杏仁。</li>
                        <li><strong>维生素D：</strong> 每日摄入推荐量（通常成人600-800 IU，70岁以上800-1000 IU）。来源：日晒（适量）、强化奶制品/谷物、蛋黄、油性鱼类（三文鱼、鲭鱼）。考虑评估血维生素D水平，必要时在医生/营养师指导下补充。</li>
                        <li><strong>蛋白质：</strong> 摄入充足优质蛋白（占每日热量15-20%），来源：瘦肉、禽类、鱼类、蛋、豆类、豆腐、坚果。蛋白质是骨骼基质的重要组成部分。</li>
                        <li><strong>其他营养素：</strong> 维生素K（深绿色叶菜）；镁、钾（坚果、种子、全谷物、豆类、香蕉、土豆）。</li>
                        <li><strong>避免：</strong> 过量盐分（促进钙流失）、过量咖啡因（>4杯/天可能轻微影响钙吸收）、过量酒精（干扰骨形成）。</li>
                        <li><strong>营养更全面：</strong> 在做到以上两点的同时，可以尝试在日常饮食中加入像VDPQQ软骨胶原蛋白肽这类营养补充品。它提供的是小分子的胶原蛋白肽，更容易被身体吸收利用。补充这类肽，有助于为骨骼提供构建胶原网络所需的原料，让骨骼在强韧（矿物质充足）的同时也保持一定的弹性和韧性，这对维持骨骼的整体健康是有益的。</li>
                    </ul>
                    {% elif result.bone_density.risk == '中风险' %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 在低风险基础上，更严格确保钙、维D达标，并关注影响吸收/流失的因素。</p>
                    <ul>
                        <li><strong>钙 & 维D：</strong> 必须确保达到或略高于推荐摄入量。饮食不足时，强烈建议在专业人士指导下补充。</li>
                        <li><strong>蛋白质：</strong> 保证足量摄入，尤其对老年人预防肌肉减少症（与跌倒骨折风险相关）很重要。</li>
                        <li><strong>钠：</strong> 严格控制盐摄入（<2300mg/天，理想1500mg），选择新鲜食材，少用加工食品和酱油。</li>
                        <li><strong>咖啡因 & 酒精：</strong> 限制咖啡因（<300mg/天，约3杯咖啡），严格限制酒精（女性≤1份/天，男性≤2份/天）。</li>
                        <li><strong>蔬果：</strong> 大量摄入丰富蔬果，提供钾、镁、维生素C、K及抗氧化剂，有益骨骼健康。</li>
                        <li><strong>考虑：</strong> 评估草酸（菠菜、甜菜叶）和植酸（全谷物、豆类）对钙吸收的潜在影响，但无需完全避免，注意分散摄入。</li>
                        <li><strong>营养更全面：</strong> 在做到以上两点的同时，可以尝试在日常饮食中加入像VDPQQ软骨胶原蛋白肽这类营养补充品。它提供的是小分子的胶原蛋白肽，更容易被身体吸收利用。补充这类肽，有助于为骨骼提供构建胶原网络所需的原料，让骨骼在强韧（矿物质充足）的同时也保持一定的弹性和韧性，这对维持骨骼的整体健康是有益的。</li>
                    </ul>
                    {% else %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 在医生/营养师监督下，通过饮食和补充剂确保关键营养素达标，并最大程度减少不利因素。</p>
                    <ul>
                        <li><strong>钙 & 维D：</strong> 必须通过饮食+补充剂达到推荐摄入量。补充剂剂量需个体化，由医生/营养师根据血检结果和饮食评估确定。</li>
                        <li><strong>蛋白质：</strong> 充足且高质量的蛋白质摄入至关重要，有助于维持肌肉和减缓骨流失。每餐都应包含优质蛋白源。</li>
                        <li><strong>钠：</strong> 严格限制，尽可能接近1500mg/天。</li>
                        <li><strong>咖啡因 & 酒精：</strong> 尽量避免或极少量摄入（酒精最好完全戒除）。</li>
                        <li><strong>营养密度：</strong> 选择营养密度高的食物，确保在控制热量（如需）的同时满足所有微量营养素需求。</li>
                        <li><strong>防跌倒相关营养：</strong> 保证充足蛋白质和维生素D以维持肌肉力量；补充维D对神经肌肉功能也很重要。</li>
                        <li><strong>药物相互作用：</strong> 如有服用骨质疏松药物，需遵医嘱注意与食物/补充剂的时间间隔（如双膦酸盐类需空腹）。</li>
                        <li><strong>营养更全面：</strong> 在做到以上两点的同时，可以尝试在日常饮食中加入像VDPQQ软骨胶原蛋白肽这类营养补充品。它提供的是小分子的胶原蛋白肽，更容易被身体吸收利用。补充这类肽，有助于为骨骼提供构建胶原网络所需的原料，让骨骼在强韧（矿物质充足）的同时也保持一定的弹性和韧性，这对维持骨骼的整体健康是有益的。</li>
                    </ul>
                    {% endif %}
                </div>
                
                <div class="advice-card">
                    <h3>运动建议</h3>
                    {% if result.bone_density.risk == '低风险' %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 规律进行多样化运动，刺激骨骼生长。</p>
                    <ul>
                        <li><strong>负重运动：</strong> 每周至少3-4次，每次30分钟以上。如：快走、慢跑、跳舞、徒步、爬楼梯、网球。</li>
                        <li><strong>肌肉力量训练：</strong> 每周2-3次，针对主要肌群（腿、背、胸、腹、手臂）。使用哑铃、弹力带或自身体重（深蹲、弓步、俯卧撑、平板支撑）。</li>
                        <li><strong>平衡与柔韧性训练：</strong> 每周2-3次，如瑜伽、太极，预防跌倒，提高身体机能。</li>
                    </ul>
                    {% elif result.bone_density.risk == '中风险' %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 坚持负重和力量训练，增加强度/频率，特别强调平衡训练。</p>
                    <ul>
                        <li><strong>负重运动：</strong> 增加频率（可尝试每周4-5次）或强度（如坡度行走、间歇跑）。选择对关节冲击较小的方式（如椭圆机、阶梯机）如果有关节问题。</li>
                        <li><strong>肌肉力量训练：</strong> 至关重要，每周2-3次。应适当增加阻力/重量（在安全前提下），重点加强下肢和核心力量（对支撑和平衡至关重要）。</li>
                        <li><strong>平衡训练：</strong> 提升优先级，几乎每天进行。单腿站立、脚跟脚尖行走、太极等。可考虑专门课程。</li>
                        <li><strong>柔韧性：</strong> 坚持拉伸，维持关节活动度。</li>
                    </ul>
                    {% else %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 安全第一！ 在医生或物理治疗师评估和指导下进行。首要目标是防跌倒和骨折，同时尽可能维持骨密度和肌肉力量。</p>
                    <ul>
                        <li><strong>避免：</strong> 高冲击运动（跳跃、跑步）、过度弯腰/扭转脊柱的运动（如仰卧起坐、高尔夫挥杆、触碰脚趾），除非专业人士特别设计。</li>
                        <li><strong>温和负重运动：</strong> 如平地快走（注意路面安全）、固定自行车（直立式）、椭圆机（低阻力）。频率根据耐受度调整。</li>
                        <li><strong>安全的力量训练：</strong> 至关重要，但需高度个性化。 重点：下肢（坐姿腿举、小腿提踵）、背部（坐姿划船）、核心（改良平板支撑、鸟狗式）。使用器械或弹力带更安全可控。低重量，多次数，强调正确姿势。务必有专业指导。</li>
                        <li><strong>平衡训练：</strong> 重中之重，每日进行。 在稳固支撑物旁练习（如厨房台面）。太极是非常好的选择。物理治疗师可提供针对性训练。</li>
                        <li><strong>姿势训练：</strong> 学习并练习保持良好姿势，保护脊柱。</li>
                        <li><strong>核心原则：</strong> 循序渐进，倾听身体声音，疼痛即止。安全环境至关重要。</li>
                    </ul>
                    {% endif %}
                </div>
                
                <div class="advice-card">
                    <h3>生活方式建议</h3>
                    {% if result.bone_density.risk == '低风险' %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 维持健康生活方式，预防风险因素。</p>
                    <ul>
                        <li><strong>维持健康体重：</strong> 过轻或过重都对骨骼不利。</li>
                        <li><strong>戒烟：</strong> 吸烟是明确的骨骼风险因素。</li>
                        <li><strong>限酒：</strong> 遵守推荐限量。</li>
                        <li><strong>安全环境：</strong> 居家注意防滑，穿合脚防滑鞋。</li>
                        <li><strong>定期体检：</strong> 包括骨密度筛查（根据年龄和风险因素）。</li>
                        <li><strong>管理压力：</strong> 慢性压力可能影响激素平衡。</li>
                    </ul>
                    {% elif result.bone_density.risk == '中风险' %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 积极改善生活方式，预防骨质流失。</p>
                    <ul>
                        <li><strong>严格戒烟：</strong> 立即戒烟对骨骼健康有显著益处。</li>
                        <li><strong>严格限酒或戒酒：</strong> 尽可能减少酒精摄入。</li>
                        <li><strong>积极防跌倒：</strong>
                            <ul>
                                <li>居家评估：移除地毯、电线等绊脚物，浴室安装扶手和防滑垫，保证照明充足。</li>
                                <li>使用辅助工具：如需要，使用手杖或助行器。</li>
                                <li>视力检查：定期检查视力，佩戴合适眼镜。</li>
                                <li>谨慎用药：了解所用药物（如安眠药、降压药）是否可能引起头晕，与医生讨论。</li>
                            </ul>
                        </li>
                        <li><strong>骨密度监测：</strong> 遵医嘱定期进行骨密度检查（DXA扫描）。</li>
                        <li><strong>疾病管理：</strong> 严格控制如类风湿关节炎、甲亢/甲减、糖尿病等慢性病。</li>
                    </ul>
                    {% else %}
                    <p style="margin-bottom: 10px"><strong>重点：</strong> 全面防护与药物治疗配合，最大程度降低骨折风险。</p>
                    <ul>
                        <li><strong>绝对戒烟：</strong> 非此不可。</li>
                        <li><strong>完全戒酒：</strong> 强烈建议。</li>
                        <li><strong>全面防跌倒：</strong>
                            <ul>
                                <li>深度家居改造： 确保所有区域（尤其浴室、楼梯）安全无障碍。安装牢固扶手、使用淋浴椅、保持地面绝对干燥防滑。</li>
                                <li>辅助工具： 必须在需要时使用手杖、助行器或轮椅，并确保工具合适。</li>
                                <li>全天候谨慎： 行动缓慢，变换姿势时（如起床、坐下）特别小心，避免登高取物，使用稳固的脚踏凳（如有扶手支撑）。</li>
                                <li>外出安全： 使用防滑鞋/拐杖头，注意不平路面、湿滑地面。</li>
                            </ul>
                        </li>
                        <li><strong>髋部保护器：</strong> 如医生建议，考虑佩戴。</li>
                        <li><strong>严格遵医嘱：</strong> 按时按量服用骨质疏松药物（如处方），并了解注意事项和复诊计划。</li>
                        <li><strong>视力与听力：</strong> 确保视力和听力得到最佳矫正。</li>
                        <li><strong>药物审查：</strong> 定期与医生和药师审查所有药物（包括非处方药），尽量减少或替换可能增加跌倒或影响骨骼的药物。</li>
                        <li><strong>心理支持：</strong> 应对对骨折的恐惧，保持积极心态参与康复和安全活动。</li>
                    </ul>
                    {% endif %}
                </div>
            </div>
            
            <div style="background-color: #f9f3e3; padding: 20px; border-radius: 10px; margin-top: 25px; border-left: 4px solid #e67e22;">
                <h3 style="color: #e67e22; margin-top: 0;">重要补充说明</h3>
                
                <p><strong>个体化：</strong> 以上建议是通用指导。每个人的具体方案应基于年龄、性别、健康状况、骨密度结果、骨折史、用药情况等，由医生、营养师和物理治疗师共同制定。</p>
                
                <p><strong>专业评估：</strong> 确定风险等级（高、中、低）需通过医生评估，包括骨密度检测（DXA扫描）、骨折风险评估工具（如FRAX）和临床风险因素判断。</p>
                
                <p><strong>药物干预：</strong> 对于中高风险，尤其是有骨折史的高风险人群，医生可能会在生活方式干预基础上加入药物治疗（如双膦酸盐类、地舒单抗、特立帕肽/阿巴洛帕肽、罗莫索单抗、雌激素调节剂等）。药物方案需严格遵医嘱。</p>
                
                <p><strong>持续监测：</strong> 生活方式需要长期坚持，风险等级和干预措施也应定期（如每1-2年或遵医嘱）重新评估调整。</p>
                
                <p style="margin-bottom: 0;">骨骼健康是终身事业，越早关注并采取正确行动，效果越好。即使是高风险人群，积极、综合的干预也能显著降低骨折风险，提高生活质量。 <strong>请务必与您的医疗团队紧密合作！</strong></p>
            </div>
        </div>
        
        <div class="navigation">
            <a href="{{ url_for('skeleton.questions') }}" class="btn">重新评估</a>
            <a href="{{ url_for('skeleton.index') }}" class="btn btn-secondary">返回首页</a>
        </div>
    </div>
</body>
</html> 